<template>
  <Drawer :title="title">
    <Grid />
  </Drawer>
</template>

<script lang="ts" setup>
defineOptions({
  name: 'AllocateDrawer',
});
import { computed, ref } from 'vue';
import { message } from 'ant-design-vue';
import { useVbenDrawer } from '@vben/common-ui';
import { useVbenVxeGrid } from '#/adapter/vxe-table';
import { busList, busSave } from '../data/api';
import {
  libraryGridOptions,
  libraryFormOptions,
  handleId,
} from '../data/options';
import { useThrottleFn } from '@vueuse/core';
const storeId = ref('');

const title = computed(() => {
  return `分配微馆管理员`;
});
const emit = defineEmits(['success']);

//  表格配置
interface RadioChangeParams {
  newValue: any; // 根据实际业务调整类型
}
const [Grid, gridApi] = useVbenVxeGrid({
  formOptions: libraryFormOptions,
  gridOptions: libraryGridOptions,
  gridEvents: {
    radioChange: ({ newValue }: RadioChangeParams) => {
      console.log(newValue);
      storeId.value = newValue?.storeId;
    },
  },
});

// 分配微馆
const setBusSave = useThrottleFn(async () => {
  console.log('setBusSave');
  let res: any = await busSave({
    storeId: storeId.value,
    userId: handleId.value,
  });
  console.log('res', res);
  message.success(res.message);
  onSucClose();
}, 1500);

// 抽屉配置
const [Drawer, drawerApi] = useVbenDrawer({
  class: 'w-3/5',
  onCancel() {
    drawerApi.close();
  },
  onConfirm: () => setBusSave(),
  onOpenChange(isOpen: boolean) {
    // if (isOpen) {
    //   let storeId: string = drawerApi.getData().storeId || '';
    //   gridApi.grid?.setRadioRowKey(storeId);
    // }
  },
});

// const getData = async () => {
// let res: any = await busList({ userId: handleId.value });
// if (res.data.length > 0) {
//   let checkRowKey = res.data[0]['storeId'] || '';
//   checkRowKey = checkRowKey + '';
//   gridApi.grid?.setRadioRowKey(checkRowKey);
// }
// };

const onSucClose = () => {
  drawerApi.close();
  emit('success');
};
</script>

<style lang="scss" scoped></style>
